<template>
  <ElDrawer v-model="visible" size="50%" :with-header="false">
    <ElForm inline ref="form" :model="queryCondition">
      <ElFormItem label="物品名称" prop="lableLike"> 
        <ElInput v-model="queryCondition.lableLike"></ElInput>
      </ElFormItem>
      <!-- <ElFormItem label="物品类型" prop="materialTypes">
         </ElFormItem> -->

      <ElFormItem>
        <ElButton icon="Remove" @click="reset()"></ElButton>
        <ElButton icon="Search" type="primary" @click="queryByCondition(1)"></ElButton>
      </ElFormItem>
    </ElForm>

    <ElTable ref="table" :data="results" @selection-change="(rows:any) => selected=rows">
      <ElTableColumn type="selection" width="64" />
      <ElTableColumn prop="materialCode" label="物品编号" width="200px"></ElTableColumn>
      <ElTableColumn prop="materialLable" label="物品名称"></ElTableColumn>
      <ElTableColumn prop="suggestPrice" label="建议采购价"></ElTableColumn>
      <ElTableColumn prop="materialType" label="物品类别"></ElTableColumn>
    </ElTable>
    <ElPagination
      background
      layout="prev, pager, next"
      :total="total"
      :page-size="queryCondition.pageSize"
      :current-page="queryCondition.pageNum"
      @current-change="queryByCondition"
    />
    <ElDivider></ElDivider>
    <ElButton type="primary" @click="addItems()" >添加到采购单</ElButton>
  </ElDrawer>
</template>
<script lang="ts">
import  { Material } from '@/entity/material.entity'

/**
 * 页面核心数据结构体说明文档
 *  materialCode: string
  materialLable: string
  suggestPrice: number
  materialType: string
}
 *
 */
// import from
export default defineComponent({
  name: 'MaterialSupport',
  emits:['postAddItems'],
  props: {
    sampleP: {
      type: Number,
      default: 0
    }
  },
  data() {
    return {
      sampleD: 'value',
      visible: false,
      queryCondition: {
        lableLike: '',
        materialTypes: [],
        pageNum: 1,
        pageSize: 8
      },
      total: 0,
      results: [] as Array<Material>,
      selected: [] as Array<Material>
    }
  },
  computed: {
    /* sampleC() {
      return this.sampleD + "--";
    }, */
  },
  created() {},
  mounted() {
    this.queryByCondition(1)
  },
  methods: {
    // sampleM() {},
    show() {
      this.visible = true
    },
    async queryByCondition(pageNum?: number) {
      if (pageNum) {
        this.queryCondition.pageNum = pageNum
      }
      const res = await axios({
        method: 'post',
        url: '/material/query',
        data: this.queryCondition
      })
      this.total = res.data.total
      this.results = res.data.results
    },
    addItems(){
      console.log("支援页面将要添加的数据",this.selected)
      this.$emit("postAddItems",this.selected);
      const table:any  = this.$refs.table
      table.clearSelection();
    }
  },
  watch: {
    // sampleP(n, o) {},
  }
})
</script>

<!--<style scoped>-->
<style lang="scss" scoped></style>
